@charset "utf-8";
@import "./inc.css";
@color:#099292; 
html,body{height: 100%;width:100%;font-family: 'Microsoft YaHei';}
iframe{border:0;text-decoration:none;width:100%;}
#cont{
    position: relative;
    padding-left:200px;
    height: 100%;
    overflow: hidden;
    #head{
        height: 48px;
        background:@color;
        position: absolute;
        left:0;
        top:0;
        width:100%;
        border-bottom:2px solid (@color)-20;
        .logo{
            float:left;
            background: (@color) url(../img/logo.png) no-repeat 5px 0;
            height: 48px;
            line-height: 48px;
            text-indent: 50px;
            color:#fff;
            padding:0 15px;
            font-size: 20px;
            text-shadow: 1px 1px 1px #333;
        }
        ul.left{
            margin-left: 10px;
            margin-top:14px;
            float:left;
            li{
                float:left;
                margin-right:1px;
                a{
                    color:#fff;
                    background: (@color)+20;
                    display: inline-block;
                    padding:.5em 1em;
                    font-size:14px;
                    border-radius: .3em .3em 0 0;
                    &:hover{
                        background: (@color)-20;
                    }
                }
            }
        }
        .right{
            position: absolute;
            right: 5px;
            top:5px;
            color:#ddd;
            a{
               color:#fff; 
               display: iinline-block;
               padding:.2em .5em;
               background:(@color)+15;
               &:hover{
                   background:(@color)-20;
                   color:#fff;
                   }
            }
        }
        ul.skin{
            position: absolute;
            right:10px;
            bottom:0px;
            overflow: hidden;
            li{
                float:left;
                 a{
                    display:block;
                    width:15px;
                    height: 15px;
                    background: #E01919;
                    margin-right: 5px;
                    border:1px solid (@color)+10;
                    &:hover{border-color:(@color)+200;}
                    &.c1{background:#099292;}
                    &.c2{background:#858585;}
                    &.c3{background:#1A7E00;}
                    &.c4{background:#E57718;}
                    &.c5{background:#63079D;}
                    &.c6{background:#BE042C;}
                    &.c7{background:#F235C8;}
                    &.c8{background:#0693EC;}
                    &.c9{background:#E5C600}
                    &.c10{background:#973766;}
                    &.act{border-color:@color+200;}
                  }
                  
            }
        }
    }
    #left{
        position: absolute;
        left:0;top:50px;
        height:100%;
        width: 150px;
        border-right:1px solid #ddd;
        background: #f5f5f5;
    }
    #right{
        height: 100%;
        position: absolute;
        left:151px;
        top:50px;
        width:500px;
        background:#fff;
        border-bottom:1px solid #ddd;
    } 
    #bottom{
        position: absolute;
        bottom:0;
        left:0;
        width: 100%;
        height: 25px;
        line-height: 25px;
        text-align: right;
        color:#999;
        background: #eee;
        span,a{
            display: inline-block;
            float:right;
            padding: 0 .5em;
            border-left:1px solid #ddd;
        }
        a{
            color:@color;
            color:#666;
            &:hover{
                background:#999;
                color:#fff;
            }
        }
    }
}


